<template>
  <el-container style="height: 100vh;">
    <el-header>
        <div style="width: 70%;float: left;">
          <h2  style="margin: 0;padding: 0">宠物医院后台管理</h2>
        </div>
        <div style="width: 30%;float: right; font-size: 16px;text-align: center;color: white">
          <div>
            <div style="color: white;height: 60px;line-height: 60px;float: right">
              <i @click="siOut" style="height: 30px;padding-top: 10px" class="el-icon-switch-button"><br>退出</i>
            </div>
            <div style="color: white;height: 60px;line-height: 60px;float: right">
               <i style="height: 30px;padding-top: 10px;margin-right: 30px" class="el-icon-s-check"><br>欢迎{{user}}</i>
            </div>
          </div>
        </div>
      </el-header>
    <el-container>
      <el-aside width="250px" style="background-color:#fafafa;height: 90vh">
        <el-menu>
          <router-link to="/backstage/index">
            <el-row style="font-size: 16px;line-height: 56px" :class="'aside_let'">
              &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<i class="el-icon-s-home"></i>&nbsp;&nbsp;首页
            </el-row>
          </router-link>
          <el-submenu index="1" :class="'aside_let'">
            <template slot="title"><i class="el-icon-s-custom"></i>医生管理</template>
            <el-menu-item-group>
              <router-link to="/backstage/doctorList">
                <el-menu-item index="1-1">医生列表</el-menu-item>
              </router-link>
              <router-link to="/backstage/doctorExamine">
                <el-menu-item index="1-2">医生审核</el-menu-item>
              </router-link>
            </el-menu-item-group>
          </el-submenu>
          <el-submenu index="2" :class="'aside_let'">
            <template slot="title"><i class="el-icon-user"></i>用户管理</template>
            <el-menu-item-group>
              <router-link to="/backstage/user">
                <el-menu-item index="2-1">普通用户</el-menu-item>
              </router-link>
              <router-link to="/backstage/vipUser">
                <el-menu-item index="2-2">会员用户</el-menu-item>
              </router-link>
            </el-menu-item-group>
          </el-submenu>
          <router-link to="/backstage/commodity">
            <el-row style="font-size: 16px;line-height: 56px" :class="'aside_let'">
              &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<i class="el-icon-first-aid-kit"></i>&nbsp;药品管理
            </el-row>
          </router-link>
          <el-submenu index="3" :class="'aside_let'">
            <template slot="title"><i class="el-icon-first-aid-kit"></i>财务管理</template>
            <el-menu-item-group>
              <router-link to="/backstage/tranRecord">
                <el-menu-item index="3-1">交易记录</el-menu-item>
              </router-link>
              <router-link to="/backstage/syPay">
                <el-menu-item index="3-2">工资发放</el-menu-item>
              </router-link>
            </el-menu-item-group>
          </el-submenu>
        </el-menu>
      </el-aside>
      <el-container>
        <el-main>
          <router-view></router-view>
        </el-main>
      </el-container>
    </el-container>
  </el-container>
</template>
<script>
export default {
  data () {
    return {
      id: '',
      name: '',
      price: '',
      Specifications: '',
      number: '',
      form: {
        id: '',
        name: '',
        price: '',
        Specifications: '',
        number: '',
        formLabelWidth: '120px'
      },
      dialogFormVisible: false,
      search: '',
      user: window.sessionStorage.user
    }
  },
  methods: {
    push (row) {
      console.log(row.number)
      row.number += 1
      this.tableData[row.$index].number = row.number
    },
    del (row) {
      this.tableData.splice(row.$index, 1)
    },
    add () {
      this.dialogFormVisible = true
    },
    addOk () {
      var lit = {id: this.form.id, name: this.form.name, price: this.form.price, Specifications: this.form.Specifications, number: this.form.number}
      this.tableData.push(lit)
      this.dialogFormVisible = false
    },
    siOut () {
      this.$router.push({name: 'login'})
    }
  }
}
</script>
<style>
 h1,h2,h3,h4,h5,h6 {
   margin: 0;
 }
.el-header {
  background-color: #167dfa;
  color: white;
  line-height: 60px;
}
.el-aside {
  color: #333;
}
a {
  text-decoration: none;
  color: black;
}
a :hover {
  background-color: #ecf5ff;
}
.aside_let {
  background-color: #f5f3f3;
  border-bottom: 1px solid #afadad;
}
.el-aside {
  border-right: 3px solid #c4c3c3;
}
</style>
